<template>
  <div class="content">
      <ul class="common-li" v-for='(item,index) in list' :key="index" @click="change(index)">
        <li>{{item.types | type}}</li>
        <li>{{item.account | totel}}</li>
        <li><img class="more-icon" src="~assets/img/icon-r@2x.png" alt=""></li>
      </ul>
      <router-link to="/change_cart" tag="div" class="common-li add">添加账户</router-link>
  </div>
</template>

<script>
export default {
  data () {
    return {
      list: []
    }
  },
  mounted () {
    this.$apiPost(`user_account_list`, {}
      ).then((data) => {
        this.list = data.data
    })
  },
  filters: {
    type (str) {
      if (str === 0) {
        return '银行卡账户'
      } else if (str === 1) {
        return '支付宝账户'
      }
    },
    totel (str) {
      return `${str.slice(0, 3)}******${str.slice(-3)}`
    }
  },
  methods: {
    change (index) {
      this.$router.push({name: 'shenq_present', params: {account:this.list[index].account ,types: this.list[index].types,account_name: this.list[index].account_name}})
    }
  }
}
</script>
<style scoped lang='scss'>
.common-li{
  display: flex;
  margin-top:0;
  &:nth-of-type(1){
    margin-top:10px
  }
  li{
      flex:1;
      line-height:50px;
      border-bottom:1px solid #e5e5e5
  }
}
.add{
  justify-content: center
}
</style>
